
import React from 'react'
import Son from '../Son'
class App extends React.Component {
    //1.初始化
    constructor() {
        super()
        console.log('初始化阶段')
        this.state = {
            show: true
        }
    }
    static getDerivedStateFromProps(props,state){
        /*
        会在调用render方法之前调用
        它应返回一个对象来更新
        如果返回null 则不更新任何内容
        */
        console.log("返回对象直接赋给state了.等价于使用setState")
        return {show:false}
    }
    // 最重要的
    shouldComponentUpdate(props, state) {
        //如果返回false阻止更新 第一次渲染和强制更新时不会执行 
        console.log('如果返回false阻止更新')
        return true
    }
    getSnapshotBeforeUpdate(props, state) {
        //获取dom元素的
        console.log('获取Dom的')
        return null
    }
    
    render() {
        console.log('我是render')
        return <div>
            {
                this.state.show && <Son></Son>
            }
            <button onClick={ ()=>{
                this.setState({show:!this.state.show})
            } }>切换显示</button>
        </div>
    }
    //挂在完成
    componentDidMount() {
        console.log('已经在页面上显示dom片段了')
    }
    //更新阶段
    componentDidUpdate() {
        console.log('组建完成更新')
    }
}
export default App